<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script type="text/javascript">
        window.onload = function (ev) {
            var select = document.forms["my_form"]["programing_language"];
            //select.value = "java";//通过value属性来设置选中哪一项
            //select.selectedIndex = 0;//通过selectedIndex设置选中哪一项
            var textNodeSQL = document.createTextNode("sql");
            var eleSQL = document.createElement("option");
            eleSQL.value = "sql";
            eleSQL.appendChild(textNodeSQL);
            var elePHP = select.children[3];//只获取子元素结点
            console.log(elePHP.value);
            select.insertBefore(eleSQL, elePHP);

            console.log(select.childNodes.length);//10
            console.log(select.children.length);//5
        }
    </script>
</head>
<body>

<form id="my_form" action="" method="post">
    <label for="programing_language">编程语言：</label>
    <select id="programing_language" name="programing_language">
        <option value="java">java</option>
        <option value="c">c</option>
        <option value="python">python</option>
        <option value="php">php</option>
    </select>
</form>

</body>
</html>
